import vue from "@vitejs/plugin-vue"
import vueJsx from '@vitejs/plugin-vue-jsx'


// elementplus相关包
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
// elementPlus提供的开箱即用的tree shaking功能
import ElementPlus from 'unplugin-element-plus/vite'

const { resolve } = require("path") //必须要引入resolve

// 数据mock配置
import { UserConfigExport, ConfigEnv } from 'vite'
import { viteMockServe } from 'vite-plugin-mock'



// https://vitejs.dev/config/
export default ({ command }: ConfigEnv): UserConfigExport => {
  return {
    plugins: [
      vue(),
      vueJsx(),
      AutoImport({
        resolvers: [ElementPlusResolver()],
      }),
      Components({
        resolvers: [ElementPlusResolver()],
      }),
      ElementPlus(),
      viteMockServe({
        // ↓解析根目录下的mock文件夹
        mockPath: "mock",
        localEnabled: command === 'serve',
        supportTs: true, // 打开后，可以读取 ts 文件模块。 请注意，打开后将无法监视.js 文件。
        watchFiles: true, // 监视文件更改 更改mock的时候，不需要重新启动编译
      }),
    ],
    // 配置别名
    resolve: {
      alias: {
        "@": resolve(__dirname, "src"),
        "@store": resolve(__dirname, "src/store")
      },
    },
    server: {
      host: '127.0.0.1',  // 监听的IP地址
      port: 3000, //启动端口
      open: true, // 自动打开
    },
  }
}
